{% extends 'encyclopedia/base.html' %}

{% block title %}{{ accessory.title }} - 相机配件详情 - 相机百科{% endblock %}

{% block content %}
<div class="container mt-4">
    <div class="row">
        <div class="col-md-12">
            <div class="card">
                <div class="card-header bg-primary text-white">
                    <h2 class="card-title mb-0">{{ accessory.title }}</h2>
                </div>
                <div class="card-body">
                    <div class="row mb-4">
                        <div class="col-md-6">
                            <p><strong>品牌：</strong>{{ accessory.brand }}</p>
                            <p><strong>分类：</strong><a href="{% url 'encyclopedia:accessory_category_detail' accessory.category.pk %}">{{ accessory.category.name }}</a></p>
                            {% if accessory.price_range %}
                            <p><strong>价格区间：</strong>{{ accessory.price_range }}</p>
                            {% endif %}
                            <p><strong>创建时间：</strong>{{ accessory.created_at|date:"Y-m-d H:i:s" }}</p>
                            {% if accessory.updated_at != accessory.created_at %}
                            <p><strong>更新时间：</strong>{{ accessory.updated_at|date:"Y-m-d H:i:s" }}</p>
                            {% endif %}
                        </div>
                        <div class="col-md-6">
                            {% if accessory.compatible_cameras.all %}
                            <div class="border rounded p-3">
                                <h5 class="mb-2">兼容相机：</h5>
                                <ul class="list-unstyled">
                                    {% for camera in accessory.compatible_cameras.all %}
                                    <li>
                                        <a href="{% url 'encyclopedia:camera_detail' camera.pk %}">{{ camera.title }}</a>
                                    </li>
                                    {% endfor %}
                                </ul>
                            </div>
                            {% endif %}
                        </div>
                    </div>
                    
                    <div class="border-top pt-4 mt-4">
                        <h4>详细介绍</h4>
                        <div class="mt-2">
                            {{ accessory.content|linebreaks }}
                        </div>
                    </div>
                </div>
                <div class="card-footer">
                    <div class="btn-group">
                        <a href="{% url 'encyclopedia:accessory_edit' accessory.pk %}" class="btn btn-primary">编辑</a>
                        <a href="{% url 'encyclopedia:accessory_delete' accessory.pk %}" class="btn btn-danger">删除</a>
                        <a href="{% url 'encyclopedia:accessory_list' %}" class="btn btn-secondary">返回列表</a>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
{% endblock %}